import styled from 'styled-components';
import Nav from './Nav';
import React from 'react';
import cs from 'classnames';
import HeightWrapper from './HeightWrapper';

const Main = styled.main`
  flex-grow: 1;
  background: #E5E5E5;
  display: flex;
  flex-direction: column;
`;

type Props = {
  className?: string;
}

const Layout: React.FC<Props> = (props) => {
  return (
    <HeightWrapper>
      <Main className={cs(props.className, 'scroll')}>
        {props.children}
      </Main>
      <Nav/>
    </HeightWrapper>
  );
};

export default Layout;